<template>
  <div>
    <TitleName
      title="合同信息"
      icon="i-carbon-bookmark-filled"
      class="title"
    ></TitleName>
    <el-table :data="contractTableList" class="mt-15px" border>
      <el-table-column
        label="合同名称"
        prop="contractName"
        :show-overflow-tooltip="true"
      >
      </el-table-column>
      <el-table-column label="业务属性" key="businessType" width="100">
        <template #default="scope">
          <dict-tag
            :isTag="false"
            :options="business_attribute"
            :value="scope.row.businessType"
          />
        </template>
      </el-table-column>
      <el-table-column label="合同状态" key="status" width="120">
        <template #default="scope">
          <dict-tag
            :isTag="false"
            :options="contract_status"
            :value="scope.row.status"
          />
        </template>
      </el-table-column>
      <el-table-column label="签署人" prop="partybSig" width="120" />
      <el-table-column label="有效时间范围" width="220">
        <template #default="scope">
          <span
            >{{ parseTime(scope.row.contractTimeBegin, '{y}-{m}-{d}') }}至{{
              parseTime(scope.row.contractTimeEnd, '{y}-{m}-{d}')
            }}</span
          >
        </template>
      </el-table-column>
      <el-table-column label="签署时间" prop="sinTime" width="110">
        <template #default="scope">
          <span>{{ parseTime(scope.row.sinTime, '{y}-{m}-{d}') }}</span>
        </template>
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="120">
        <template #default="scope">
          <el-button
            link
            type="primary"
            size="small"
            @click="handleDetails(scope.row)"
            >详情</el-button
          >
          <el-button
            link
            :type="scope.row.status == 1 ? 'primary' : ''"
            size="small"
            @click="scope.row.status == 1 ? handleFulfil(scope.row) : ''"
            >完结</el-button
          >
        </template>
      </el-table-column>
    </el-table>
    <!-- 合同状态变更 -->
    <ContractStatuDialog
      :contractParam="contractParam"
      v-bind="$attrs"
      @close="FulfilFn"
    ></ContractStatuDialog>
  </div>
</template>

<script setup name="ProjectContract">
import { getCurrentInstance } from 'vue'
import { useRouter } from 'vue-router'
import ContractStatuDialog from './contractStatuDialog.vue'
import {
  project_phase, //项目阶段
  project_properties, //项目属性
  business_attribute, //业务属性
  contract_status
} from '@/hooks/dict/useProject'
import { addDownloadLog } from '@/api/fileManage'
const router = useRouter()
const { proxy } = getCurrentInstance()
// 接受父级传递的参数
const props = defineProps({
  baseDetail: {
    required: true,
    type: Object || Array,
    default: () => {
      return {}
    }
  },
  financeDetail: {
    required: true,
    type: Object || Array,
    default: () => {
      return {}
    }
  },
  //合同信息
  contractTable: {
    required: true,
    type: Object || Array,
    default: () => {
      return {}
    }
  }
})
watchEffect(
  () => {
    overviewInfo.value = { ...props.baseDetail, ...props.financeDetail }
    contractTableList.value = [...props.contractTable]
  },
  {
    flush: 'post'
  }
)

const data = reactive({
  contractParam: {},
  //详情的数据
  overviewInfo: {},
  // 合同信息
  contractTableList: []
})
const { contractParam, overviewInfo, contractTableList } = toRefs(data)
/* 合同管理 模块--start*/
// 详情
const handleDetails = row => {
  router.push({
    path: '/sales/contract/contractDetail',
    query: { id: row.rcId }
  })
}
// 完结
const handleFulfil = row => {
  contractParam.value.visible = true
  contractParam.value.contractName = row.contractName
  contractParam.value.rcId = row.rcId
  contractParam.value.status = row.status
  contractParam.value.updateRemark = row.updateRemark
  contractParam.value.ordProjectId = row.ordProjectId
}
//完结 弹出框
const FulfilFn = row => {
  contractParam.value.visible = false
}
/* 合同管理 模块--end*/
</script>

<style scoped lang="scss"></style>
